<!DOCTYPE html>
<html>
<head>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.slim.min.js"></script>
    <script src="https://cdn.bootcss.com/popper.js/1.14.7/umd/popper.min.js"></script>
    <script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="index.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <meta charset="UTF-8">
    <title>Home页</title>
</head>
<body>
<nav>
    <div class="container">
        <ul class="clone">
            <li class="nba1">
                <img src="images/brand-white.png" alt="">
            </li>
            <li class="nba">
                <a href="">Home</a>
            </li>
            <li class="nba">
                <a href="">Porfile</a>
            </li>
            <li class="nba">
                <a href="">Messages</a>
            </li>
            <li class="nba">
                <a href="">Docs</a>
            </li>
        </ul>
    </div>
</nav>
<div class="header">
    <div class="container">
        <div class="row">
            <div class="col-md-3">
                <div class="sss">
                    <div class="xo"></div>
                    <img src="images/avatar-dhg.png" alt="" style="height: 100px;width: 100px;text-align: center;border-radius: 50%; margin-top: -20%;">
                    <div class="xe  text-center">
                        <h3 style="font-size: 12px;">chart gives us an</h3>
                        <p>The chart gives us an overall picture of the
                            an overall picture of the</p>
                    </div>
                </div>
                <div class="ssss">
                    <h5>About</h5>
                    <p>The chart <a href="">gives us an overall</a></p>
                    <p>The cha <a href="">gives us an overall</a></p>
                    <p>The chart <a href="">gives overall</a></p>
                    <p>The chart <a href="">gives usoverall</a></p>
                    <p>The chart <a href="">givesan overall</a></p>
                </div>
                <div class="aaa">
                    <h5>Photos</h5>
                    <img src="images/instagram_5.jpg" alt="">
                    <img src="images/instagram_6.jpg" alt="">
                    <img src="images/instagram_7.jpg" alt="">
                    <img src="images/instagram_8.jpg" alt="">
                    <img src="images/instagram_9.jpg" alt="">
                    <img src="images/instagram_10.jpg" alt="">
                </div>
            </div>
            <div class="col-md-6">
                <div class="qqq">
                    <h6>What day!<span>day!</span></h6>
                    <p class="fff">July 15,2014, the day I’ll never forget.
                        It was a sunny day, but I was anxious, nervous and meanwhile,
                        a little excited, for I was waiting for the arrival of my
                        university admission notice. It was not until 3 pm that
                        I finally waited the arrival of a green mail car full of hope.
                        Only when I got the admission notice, did I believe that I was
                        really admitted to my dream university—…university. It not
                        only meant my past efforts and persistence not in vain, but
                        also meant that I would say goodbye to the dull high school
                        life, and step into the colorful university life.</p>
                    <img src="images/instagram_1.jpg" alt="">
                    <img src="images/instagram_13.jpg" alt="">
                    <img src="images/unsplash_1.jpg" alt="">
                    <img src="images/unsplash_2.jpg" alt="">
                    <p><strong>I finally </strong>waited the arrival of a green mail car full of hope.
                        Only when I got the admission notice, did I believe that I was
                        really admitted to my dream university—…university. It not
                        only meant my past efforts and persistence not in vain, but
                        also meant that I would say goodbye to the dull high school
                        life, and step into the colorful university life.</p>
                    <p><strong>I finally</strong> waited the arrival of a green mail car full of hope.
                        Only when I got the admission notice, did I believe that I was
                        really admitted to my dream university—…university. It not.</p>
                </div>
                <div class="wqa">
                    <h6>What day!<span>day!</span></h6>
                    <p class="fff">July 15,2014, the day I’ll never forget.
                        It was a sunny day, but I was anxious, nervous and meanwhile,
                        a little excited, for I was waiting for the arrival of my
                        university admission notice. It was not until 3 pm that
                        I finally waited the arrival of a green mail car full of hope.
                        Only when I got the admission notice, did I believe that I was
                        really admitted to my dream university—…university. It not
                        only meant my past efforts and persistence not in vain, but
                        also meant that I would say goodbye to the dull high school
                        life, and step into the colorful university life.</p>
                </div>
                <div class="guh">
                    <h6>What day!<span>day!</span></h6>
                    <p> university admission notice. It was not until 3 pm that
                        I finally waited the arrival of a green mail car full of hope.
                        Only when I got the admission notice, did I believe that I was
                        really admitted to my dream university—…university. It not
                        only meant my past efforts and persistence not in vain, but
                        also meant that I would say goodbye </p>
                    <img src="images/instagram_3.jpg" alt="">
                    <p><strong>I finally</strong> waited the arrival of a green mail car full of hope.
                        Only when I got the admission notice, did I believe that I was
                        really admitted to my dream university—…university. It not.
                        to my dream university—…university. It not.</p>
                </div>
            </div>
            <div class="col-md-3">
                <div class="mgi">
                    <h5>Messages</h5>
                    <img src="images/instagram_2.jpg" alt="">
                    <h5>some are precious </h5>
                    <p>but also meant that I would say goodbye life,and unforgettable memories.</p>
                    <button type="button" class="btn btn-primary">Primary</button>
                </div>
                <div class="mgi22">
                    <h5>life</h5>
                    <div class="ssqq">
                        <img src="images/avatar-dhg.png" alt="" style="height: 60px;width: 60px;border-radius:50%;position: absolute;">
                        <div class="ghhy1">
                            <h5>some are <span>precious </span></h5>
                            <button type="button" class="btn btn-primary">Primary</button>
                        </div>
                    </div>
                    <div class="cchyc">
                        <img src="images/avatar-mdo.png" alt="" style="height: 60px;width: 60px;border-radius:50%;position: absolute;">
                        <div class="vghbgh1">
                            <h5>some are <span>precious </span></h5>
                            <button type="button" class="btn btn-primary">Primary</button>
                        </div>
                    </div>
                </div>
                <div class="fgh1">
                    <p>July 15,2014, the day I’ll never forget. It was a sunny day, but I was anxious, nervous and meanwhile,</p>
                </div>
            </div>
        </div>
    </div>
</div>
<footer>
    <div class="vfr">
        <div class="container">
            <div class="dfgh text-center">
                <p>the admission notice, did I believe that I was really admitted to
                    <span>my dream university—…</span>university. It not only <span>meant my pa</span>
                </p>
                <p class="dfffff">
                    <a href="">Home</a>

                    <a href="">Porfile</a>

                    <a href="">Messages</a>

                    <a href="">Docs</a>
                </p>


            </div>
        </div>
    </div>

</footer>
</body>
</html>
